<!doctype html>
<html>

<head>
    <meta charset="UTF-8" />
    <title><?php echo $config['app']?>安装向导 - Powered by <?php echo $config['company']?></title>
    <link rel="stylesheet" href="<?php echo $this->assets('/static/install/css/install.css'); ?>" />
</head>

<body>
    <div class="wrap">
        <header>
            <div class="title"><span class="app"><?php echo $config['app']?></span> 安装向导</div>
            <div class="version"></div>
        </header>
        <div class="step">
            <ul>
                <li><span>1</span>检测环境</li>
                <li><span>2</span>创建数据</li>
                <li class="current"><span>3</span>完成安装</li>
            </ul>
        </div>
        <section class="content">
            <div class="install" id="log-list">
                <ul id="log"></ul>
            </div>

            <div class="buttom">
                <a href="javascript:;" class="btn" style="background-color: #ddd;">
                    <img src="/static/install/img/loading.gif" align="absmiddle" />&nbsp;正在安装...
                </a>
            </div>
        </section>
    </div>
    <footer class="footer">
        &copy; 2020-2021 <?php echo $config['company']?>
    </footer>
    <script>
        var n = 0;
        var query = '<?php echo http_build_query($query); ?>';
        var baseUrl = '<?php echo $container->url->build("/install", ["step" => 4, "install" => 1]);?>'
        // ajax请求
        function ajax(url, data, callback) {
            if (window.XMLHttpRequest) {
                var xhr = new XMLHttpRequest();
            } else {
                var xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            //2.连接服务器（打开和服务器的连接）
            xhr.open('POST', url, true);
            xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            //3.发送
            xhr.send(data);
            //4.接收
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    if (xhr.status == 200) {
                        var result = JSON.parse(xhr.responseText);
                        if (callback) {
                            callback(result)
                        }
                    } else {
                        alert('安装程序网络异常！请重新安装！');
                    }
                }
            };
        }

        // 执行安装
        function run(result) {
            if (result.code == '1') {
                var data = result.data;
                var code = data.code
                var url = baseUrl + '&code=' + code
                var el = document.getElementById('log');
                var html = '<li><span style="color: #339966;"> &radic; </span> ' + result.msg + '</li>';
                append(el, html)
                toLogBottom()
                if (code == 99999) {
                    setTimeout(function () {
                        window.location.href = '<?php echo $container->url->build("/install", ["step" => 5]);?>'
                    }, 2000)
                    return;
                } else {
                    if (code == 2) {
                        // 分步导入sql，url添加当前行参数
                        url += '&line=' + (data.line || 0)
                    }
                    setTimeout(function () {
                        ajax(url, query, run)
                    }, 200)
                }

            } else {
                alert(result.msg || '安装异常，请重新安装！');
            }
        }

        // append方法
        function append(el, html) {
            var divTemp = document.createElement("div");
            var nodes = null;
            var fragment = document.createDocumentFragment();
            divTemp.innerHTML = html;
            nodes = divTemp.childNodes;
            for (var i = 0, l = nodes.length; i < l; i++) {
                var item = nodes[i]
                fragment.appendChild(item.cloneNode(true));
            }
            // 插入到最后 append
            el.appendChild(fragment);
        }

        function toLogBottom() {
            var div = document.getElementById("log-list");
            div.scrollTop = div.scrollHeight;
        }

        window.onload = function () {
            run({
                code: 1,
                msg: '开始安装...',
                data: {
                    code: 0
                }
            })
        }
    </script>
</body>

</html>